<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>集分卡兑换</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="__PUBLIC__/Product/css/page_jifenkaduihan.css">
    <link rel="stylesheet" href="__PUBLIC__/Product/css/lib/animate.css">
    <script src="__PUBLIC__/Product/js/lib/flexible.js"></script>
</head>
<body style="background-color: #f4f4f4;">
    <div class="jfk_exchange_box">
        <!-- 头部 -->
        <div class="jfk_exchange_header">
            <p><img class="goBcak" src="__PUBLIC__/Product/img/fanhui.png" /></p>
            <p>集分卡兑换</p>
            <p><img src="__PUBLIC__/Product/img/yiwen.png" class="why"/></p>
        </div>
        <!-- 内容 -->
        <div class="jfk_exchange_content">
            <ul>
                <li>
                    <label for="">卡号</label>
                    <input type="text" value="" placeholder="请输入卡号" type="number" class="user_num" maxlength="13" />
                    <img src="__PUBLIC__/Product/img/quxiao.png" style="float: right;" class="quxiao" maxlength="8" />
                </li>
                <li>
                    <label for="">卡密</label>
                    <input type="text" placeholder="请输入密码" class="user_pwd" />
                </li>
            </ul>
            <p class="agree"><span class="circle"></span><span>同意</span><span class="showProtocol">《集分卡兑换服务协议》</span></p>
        </div>
        <div class="jfk_exchange_footer">
            <p>提示:您兑换的是<span style="color:#c30d23"></span>元集分卡面值</p>
            <div>确定</div>
        </div>
        <!--蒙版-->
        <div class="mask"></div>
        <!--兑换服务协议-->
        <div class="rule">
        	<p class="p_top">
        		兑换规则
        		<img src="__PUBLIC__/Product/img/xx.png" alt="" class="guanbi"/>
        	</p>
        	<div class="div_con">
        		<div>集分获得</div>
        		<p>1、购物集分：你的每次购物，按实际支付金额，每1元送2集分。（除了购物集分外，每次购物你还会获得额外奖励集分，奖励集分有效期为10天。）集分会在系统显示包裹签收后，自动计入你的个人账户。</p>
        		<p>2、集分夺宝获得：你每参加一次集分夺宝，会赠送10集分。</p>
        		<div>集分抵扣</div>
        		<p>1、集分可全额抵扣货款，200集分可抵扣1元。</p>
        		<p>2、集分和优惠券，不支持同时使用；运费不返集分，也不支持集分抵扣。</p>
        	</div>
        </div>
        <!--兑换规则-->
        <div class="protocol">
        	<p class="p_top">
        		兑换服务协议
        		<img src="__PUBLIC__/Product/img/xx.png" alt="" class="guanbi"/>
        	</p>
        	<div class="div_con">
        		<p class="p1">本兑换协议由杭州天缘网络技术有限公司和您签订。最终解释权由本公司负责。</p>
        		<div>一.服务内容</div>
        		<p class="p1">集分卡得具体服务内容由集分卡根据实际情况提供，例如微博客服务、照片上传功能、在线交流、逛逛软件等。集分卡保留变更、中断或终止部分网络服务得协议。集分卡不承担因业务调整给用户造成得损失。</p>
        		<div>二.隐私保护</div>
        		<p class="p2">1、事先获得用户的明确授权。</p>
        		<p class="p2">2、只有透露你的个人资料，才能提供你所要求的产品和服务。</p>
        	</div>
        </div>
        <!-- 弹框 -->
        <div class="alert"></div>
    </div>
</body>
</html>
<script src="__PUBLIC__/Product/js/lib/jquery3.2.1.js"></script>
<script>
    $(function () {
        var user_num = $(".user_num").val();
        var user_pwd = $(".user_pwd").val();
        $('.jfk_exchange_footer').hide();
        
        $('.circle').bind('click',function(){
        	$(this).toggleClass('active');
        });
        $('.why').click(function(){
        	$('.mask').show();
        	$('.rule').show();
        });
        $('.showProtocol').click(function(){
        	$('.mask').show();
        	$('.protocol').show();
        });
        $('.guanbi').click(function(){
        	$('.mask').hide();
        	$('.rule').hide();
        	$('.protocol').hide();
        });
        $('.goBack').click(function(){
    		window.location.href = document.referrer; //返回上一页并刷新
    	});
        $(".user_pwd").bind("input propertychange", function () {
            var pwd = $(this).val();
            var accountNumber = $(this).parent('li').siblings('li').children('.user_num').val();
            if (fit1(accountNumber)) {
                if (pwd.length == 8) {
                    if (fit2(pwd)) {
                        if ($('.circle').hasClass('active')) {
                        	$.ajax({
	                            url: 'http://a.91jfk.com/Product/Exchange/check_card',
	                            type: 'post',
	                            dataType: 'json',
	                            data: {
	                                cardid: accountNumber,
	                                password: pwd
	                            },
	                            success: function (res) {
	                                console.log(res);
	                                if (res.code == '1') {
	                                    $('.jfk_exchange_footer').show().children('p').children(
	                                        'span').eq(0).text(res.worth).parents().siblings(
	                                        'div').click(function () {
	                                        $.ajax({
	                                            url: 'http://a.91jfk.com/Product/Exchange/exchange',
	                                            type: 'post',
	                                            dataType: 'json',
	                                            data: {
	                                                cardid: accountNumber,
	                                                password: pwd
	                                            },
	                                            success: function (res) {
	                                                console.log(res);
	                                            },
	                                            error: function (err) {
	                                                console.log(err);
	                                            }
	                                        });
	                                    });
	                                }
	                            },
	                            error: function (err) {
	                                console.log(res.msg);
	                            }
	                        });
                        } else{
                        	$('.alert').show().addClass('show').text('请先阅读集分卡兑换服务协议');
		                    setTimeout(function(){
		                        $('.alert').fadeOut('slow').removeClass('show').text('');
		                    },3000);
                        }
                    } else {
                        $('.alert').show().addClass('show').text('请输入正确的卡密');
	                    setTimeout(function(){
	                        $('.alert').fadeOut('slow').removeClass('show').text('');
	                    },3000);
                    }
                }
            } else {
                $('.alert').show().addClass('show').text('请输入正确的卡号');
                setTimeout(function(){
                    $('.alert').fadeOut('slow').removeClass('show').text('');
                },3000);
            }
        });

        $(".quxiao").bind("click", function () {
            $(".user_num").val("");
        });

        //卡号验证
        function fit1(phone) {
            var rules = /^[0-9]{13}$/;
            return rules.test(phone)
        }

        //密码验证
        function fit2(phone) {
            var rules = /^[0-9]{8}$/;
            return rules.test(phone)
        }

        //验证银行卡号的
        function CheckBankNo(t_bankno) {　　
            var bankno = $.trim(t_bankno.val());　　
            if (bankno == "") {　　
                $("#banknoInfo").html("请填写银行卡号");
                return false;
            }
            if (bankno.length < 16 || bankno.length > 19) {
                $("#banknoInfo").html("银行卡号长度必须在16到19之间");
                return false;
            }
            var num = /^\d*$/; //全数字
            if (!num.exec(bankno)) {
                $("#banknoInfo").html("银行卡号必须全为数字");
                return false;
            }
            //开头6位
            var strBin =
                "10,18,30,35,37,40,41,42,43,44,45,46,47,48,49,50,51,52,53,54,55,56,58,60,62,65,68,69,84,87,88,94,95,98,99";
            if (strBin.indexOf(bankno.substring(0, 2)) == -1) {
                $("#banknoInfo").html("银行卡号开头6位不符合规范");
                return false;
            }
            //Luhm校验（新）
            if (!luhmCheck(bankno))
                return false;
            $("#banknoInfo").html("验证通过!");
            return true;
        }
    });
</script>